<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        .btnGroup{
            height: 4rem;
        }
    </style>
</head>
<body>
<div>
    <audio controls src=""></audio>

</div>
<div class="btnGroup">
    <input type="text">
    <input type="text">
    <input type="text">
</div>

<button class="play">播放</button>


<script src="jquery-2.2.4.min.js"></script>
<script>

    // let txts = ["刘珊珊你好,", "哈迪你好,", "李映杰你好,"];

/*    let url = `https://openapi.baidu.com/oauth/2.0/token?
    grant_type=client_credentials
    &client_id=fUqhuhqpAM9gjnn2wZD8K8lm
    &client_secret=pShvo52Zj8PtjqvbHwHjIgPBuOFx6KLo`
    let token = `24.d34fc17504966a4918e5664a42fa3e42.2592000.1532783499.282335-11460670`;*/
    $(function () {
        let index = 0;
/*
        $("audio").attr("src", function () {
            return `http://tsn.baidu.com/text2audio?lan=zh&ctp=1&cuid=abcdxxx&tok=24.d34fc17504966a4918e5664a42fa3e42.2592000.1532783499.282335-11460670`
                + `&tex=${txts[index]}&vol=9&per=0&spd=5&pit=5`
        });
*/
        let audio = $("audio")[0];
        $(".play").click(function () {
            let txts = [$("input:eq(0)").val(), $("input:eq(1)").val(), $("input:eq(2)").val()];

            $(audio).attr("src", function () {
                return `http://tsn.baidu.com/text2audio?lan=zh&ctp=1&cuid=abcdxxx&tok=24.d34fc17504966a4918e5664a42fa3e42.2592000.1532783499.282335-11460670`
                    + `&tex=${txts[index]}&vol=9&per=0&spd=5&pit=5`
            });
            audio.play();
            audio.addEventListener('ended', function () {
                if (index < txts.length - 1) {
                    index++;
                    $(audio).attr("src", function () {
                        return `http://tsn.baidu.com/text2audio?lan=zh&ctp=1&cuid=abcdxxx&tok=24.d34fc17504966a4918e5664a42fa3e42.2592000.1532783499.282335-11460670`
                            + `&tex=${txts[index]}&vol=9&per=0&spd=5&pit=5`
                    });
                    audio.play()

                } else{
                    index = 0
                }
            }, false);
        })


    })

</script>
</body>
</html>